<template>
    <div class="l-rblock l-form-viewer" style="padding:8px;">
        <el-form :model="formData" :rules="rules" size="mini" labelPosition="right" labelWidth="80px" ref="form">
            <div class="l-auto-window only-tabs">
                <el-tabs v-model="activeName" type="card">
                    <el-tab-pane class="l-tabs-container" :label="$t('主表信息')" name="tab0">
                        <el-row :gutter="0">
                            <div class="l-rblock">
                                <el-col v-if="lr_formLookAuth('case_erp_customergatherdetail_f_AmountCollect')"
                                    :span="24">
                                    <el-form-item :label="$t('回款金额')"
                                        prop="case_erp_customergatherdetail_f_AmountCollect">
                                        <el-input-number
                                            :disabled="!lr_formEditAuth('case_erp_customergatherdetail_f_AmountCollect', isReadOnly)"
                                            v-model="formData.case_erp_customergatherdetail_f_AmountCollect"
                                            controls-position="right" :min="1" :max="unpaidAmount"></el-input-number>
                                    </el-form-item>
                                </el-col>
                                <el-col v-if="lr_formLookAuth('case_erp_customergatherdetail_f_Date')" :span="24">
                                    <el-form-item :label="$t('回款日期')" prop="case_erp_customergatherdetail_f_Date">
                                        <l-date
                                            :disabled="!lr_formEditAuth('case_erp_customergatherdetail_f_Date', isReadOnly)"
                                            :readonly="false" format="yyyy-MM-dd" dateType="date" :clearable="true"
                                            v-model="formData.case_erp_customergatherdetail_f_Date"
                                            :placeholder="$t('请选择')" />
                                    </el-form-item>
                                </el-col>
                                <el-col v-if="lr_formLookAuth('case_erp_customergatherdetail_f_Description')"
                                    :span="24">
                                    <el-form-item :label="$t('备注')" prop="case_erp_customergatherdetail_f_Description">
                                        <el-input type="textarea"
                                            :disabled="!lr_formEditAuth('case_erp_customergatherdetail_f_Description', isReadOnly)"
                                            v-model="formData.case_erp_customergatherdetail_f_Description"
                                            :placeholder="$t('请输入')" />
                                    </el-form-item>
                                </el-col>
                                <el-col v-if="lr_formLookAuth('case_erp_customergatherdetail_f_File')" :span="24">
                                    <el-form-item :label="$t('附件')" prop="case_erp_customergatherdetail_f_File">
                                        <l-upload drag maxSize="10" sizeType="MB" :limit="1" showFileList="uploadTheme1"
                                            :disabled="!lr_formEditAuth('case_erp_customergatherdetail_f_File', false || isReadOnly)"
                                            v-model="formData.case_erp_customergatherdetail_f_File"
                                            :placeholder="$t('请输入')" />
                                    </el-form-item>
                                </el-col>
                            </div>
                        </el-row>
                    </el-tab-pane>

                </el-tabs>
            </div>
        </el-form>
    </div>
</template>
<script>
const api = window.$api.erpcase.customerGather

export default {
    props: {
        isReadOnly: {
            type: Boolean,
            default: false
        },
        id: {
            type: String,
            default: ''
        },
        // 最大回款金额
        unpaidAmount: {},
    },
    data() {
        return {
            moduleCode: 'erp_customergatherdetail',
            activeName: 'tab0',
            formData: {
                case_erp_customergatherdetail_f_AmountCollect: "", // 回款金额
                case_erp_customergatherdetail_f_Date: "", // 回款日期
                case_erp_customergatherdetail_f_Description: "", // 备注
                case_erp_customergatherdetail_f_File: "", // 附件

            },
            rules: {
                case_erp_customergatherdetail_f_AmountCollect: [
                    { required: true, message: '请输入回款金额' },
                    { pattern: /^-?[0-9]+$/, message: '请输入数字' },
                ],
                case_erp_customergatherdetail_f_Date: [
                    { required: true, message: '请选择回款日期' },
                ],

            },

        };
    },
    computed: {
        // case_erp_saledetail_f_UnitOptions(){
        //     const data = this.lr_DataSource('ERP_SaleList')
        //     return this.lr_DataSourceOptions(data,'f_id','f_theme')
        // },
    },
    methods: {


        // 重置表单
        resetForm() {
            this.$formClear(this.$refs.form)
            this.activeName = 'tab0'

        },
        // 校验表单
        async validateForm() {
            if (!await this.$formValidateWraper(this.$refs.form)) {
                return false
            }

            return true
        },
        // 设置表单数据
        setForm(data) {
            this.$setFormData(this.formData, data, 'case_erp_customergatherdetail')

        },
        // 获取表单数据
        getForm() {
            return this.$getFormData(this.formData, 'case_erp_customergatherdetail')

        },

        async loadFormData({ keyValue/*,params,node*/ }) {//  keyValue 流程中相当于流程processId,params 传递参数,node 流程节点
            const data = await this.$awaitWraper(api.getRecord(keyValue))
            if (data) {
                this.setForm(data)
                return true
            }
            else {
                return false
            }
        },

        async saveForm({ keyValue, isEdit/*,code,node*/ }) {// isEdit 是否更新数据, keyValue 流程中相当于流程processId,code 表示流程中的操作码,node 流程节点
            const postData = this.getForm()
            if (isEdit) {// 编辑
                return await this.$awaitWraper(api.putRecord(keyValue, postData))
            }
            else {// 新增
                postData.f_GatherId = this.id
                // console.log("新增112",postData)
                return await this.$awaitWraper(api.addRecord(postData))
            }
        },
    }
}
</script>